searchbar 搜索框

更新时间：2022-02-16

iov-searchbar 搜索框

搜索框

属性说明：

属性名	类型	默认值	必填	说明
class-name	String	无	否	自定义 class
value	String	无	否	输入框的内容
maxlength	Number	无	否	输入最大长度
placeholder	String	无	否	输入框为空时占位符
placeholder-style	String	无	否	placeholder 的样式
placeholder-class	String	无	input-placeholder	placeholder 的样式类
disabled	Boolean	false	否	是否禁用
confirmHold	Boolean	false	否	点击键盘右下角按钮时是否保持键盘不收起
cursor	Number	无	否	指定 focus 时的光标位置开发者工具暂不支持
selectionStart	Number	-1	否	光标起始位置，自动聚焦时有效，需与 selection-end 搭配使用
selectionEnd	Number	-1	否	光标结束位置，自动聚焦时有效，需与 selection-start 搭配使用
bindinput	EventHandle	无	否	当键盘输入时，触发 input 事件，event.detail = {value, cursor, keyCode}，keyCode 为键值。
bindfocus	EventHandle	无	否	输入框聚焦时触发，event.detail = {value: value, height: height}, height 为键盘高度。
bindblur	EventHandle	无	否	输入框失去焦点时触发，event.detail = {value: value}。
bindconfirm	EventHandle	无	否	点击完成按钮时触发，event.detail = {value: value}。
bindcommon	EventHandle	无	否	点击 audio 按钮触发的方法

示例：

json:

{
    "navigationBarTitleText": "iov-searchbar组件",
    "usingComponents": {
        "iov-searchbar": "iov-ui/lib/searchbar"
    }
}

swan:

<view class="test">
    <view>
        <iov-searchbar
            bindfocus="bindfocus"
            placeholder="请输入"
            bindaudio="bindaudio"
            bindinput="bindinput"
        />
    </view>
    <view class="text">
        <view>输入的内容</view>
        <view>{{value}}</view>
    </view>
</view>

js:

Page({
    data: {
        value: ''
    },
    bindfocus() {
        console.log('获得焦点');
    },
    bindaudio() {
        console.log('点击了audio');
    },
    bindinput(e) {
        console.log(e);
        this.setData({
            value: e.detail.value
        });
    }
});

rate 评分 Sidebar 侧边导航